import { DirectiveOptions } from 'vue'
import { config } from '@/utils'

export const permission: DirectiveOptions = {
  bind: function (el: any, binding, vnode) {
    if (config.test) return

    el.__vOriginalDisplay = el.style.display

    console.log('directives currentRoute', vnode.context!.$route)

    const permissions: Array<string> = []
    const hasPermission = permissions.includes(binding.value)
    if (!hasPermission) {
      el.style.display = 'none'
    }
  },
  update: function (el: any, binding, vnode) {
    if (config.test) return

    const { value, oldValue } = binding
    if (value === oldValue) return

    const permissions: Array<string> = []
    const hasPermission = permissions.includes(value)
    el.style.display = hasPermission ? el.__vOriginalDisplay : 'none'
  }
}
